<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit"/>

    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
    <meta name="apple-mobile-web-app-capable" content="none" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no, email=no" />

    <!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
    <meta name="HandheldFriendly" content="true">
    <!-- 微软的老式浏览器 -->
    <!-- 微软的老式浏览器 -->
    <meta name="MobileOptimized" content="320">
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <!-- windows phone 点击无高光 -->
    <meta name="msapplication-tap-highlight" content="no">
    <link rel="shortcut icon" href="${basePath}uploadFiles/favicon.ico" type="image/x-icon">
    <title>中银快缴</title>
</head>
<body>

<!--<header class="header">-->
    <!--<div class="header-container bg-gary">-->
        <!--<h3 style="width:95%">欢迎来到中国银行北京分行</h3>-->
    <!--</div>-->
    <!--<div class="header-container sys-header-container">-->
        <!--<div class="navbar sysnavbar">-->
            <!--<a><img src="${basePath}static/images/logo.png"/></a>-->
            <!--<nav style="height:100%">-->
                <!--<div class="userLogin" id="userLogin"  style=" margin-right: 7rem;">-->
                    <!--<em class="iconfont icon-iconfontyonghu" style=" font-size: 30px;"></em>-->
                    <!--<b class="layui-b" id="toggle">张三</b>-->
                    <!--<ul id="toggleDorw">-->
                        <!--<li id="roleName"></li>-->
                        <!--<li id="deptName"></li>-->
                        <!--<li style="cursor:pointer;"><a href="${basePath}logout">注销</a></li>-->
                    <!--</ul>-->
                <!--</div>-->
            <!--</nav>-->
        <!--</div>-->
    <!--</div>-->
<!--</header>-->
<#include "common/_header.html" />
<div class="content-container sys-content-container">
    <ul class="layui-nav layui-nav-tree" id="topUl" lay-filter="demo">
    </ul>
    <div id="iframeContent" class="iframeContent"  >
    </div>
</div>

<#include "common/_footersys.html" />

</body>
</html>
<script>
    var layer;

    layui.use('layer', function() {
        layer = layui.layer;
    });

    $.defult_url = "sysuser/menu/Main";
    userLogin();
    function userLogin(){
        $.ajax({
            url:basePath+"sysuser/user/showUser",
            dataType:"json",
            async:false,
            success:function (data) {
                if (data.status == 'success') {
                    $("#userLogin").show();
                    $("#toggle").text(data.t.comUserName);
//                    $("#roleName").text(data.t.comCode);
//                    $("#deptName").text(data.t.postName);
                }
            }
        });
    }

    loadMenu();
    function loadMenu(){
        debugger;
        $.ajax({
            url : basePath+"sysuser/menu/getMenuByUrl?menuId=${menuId}",
            type : "get",
            dataType:"JSON",
            contentType:"application/json",
            async:true,
            success : function(data){
                if(data.status='success'){
                    var menu = data.t;
                    $("#topUl").empty();
                    for (var i = 0;i < menu.length;i++){
                        if(menu[i].sysMenus.length > 0){


                            $("#topUl").append('<li class="layui-nav-item layui-nav-itemed"><a href="javascript:;">'+menu[i].menuName+'</a><dl id="'+menu[i].menuId+'" class="layui-nav-child"></dl></li>');
                            for (var j = 0;j < menu[i].sysMenus.length;j++){

                                if(menu[i].sysMenus[j].sysMenus.length > 0){
                                    $("#"+menu[i].menuId).append('<dd class="common-nav-dd" style="cursor: pointer"><a href="javascript:;">'+menu[i].sysMenus[j].menuName+'<span class="common-nav-off"></span></a><ol id="'+menu[i].sysMenus[j].menuId+'" class="common-nav"></ol></dd>');
                                    for(var n = 0; n < menu[i].sysMenus[j].sysMenus.length; n++){
                                        $("#"+menu[i].sysMenus[j].menuId).append('<li class="common-nav-li" style="cursor: pointer"><a class="common-nav-a" onclick="loadPage(\''+menu[i].sysMenus[j].sysMenus[n].menuUrl+'\')">'+menu[i].sysMenus[j].sysMenus[n].menuName+'</a></li>');
                                    }
                                } else{
                                    $("#"+menu[i].menuId).append('<dd style="cursor: pointer"><a class="common-nav-a" onclick="loadPage(\''+menu[i].sysMenus[j].menuUrl+'\')">'+menu[i].sysMenus[j].menuName+'</a></dd>');
                                }

                            }
                        }else{
                            $("#topUl").append('<li class="layui-nav-item"><a onclick="loadPage(\''+menu[i].menuUrl+'\')">'+menu[i].menuName+'</a></li>');
                        }
                    }
                }
                layui.use('element', function(){
                    var element = layui.element(); //导航的hover效果、二级菜单等功能，需要依赖element模块
                    //监听导航点击
                    element.on('nav(demo)', function(elem){
                    });
                });

                function stopPropagation(e) {
                    if (e.stopPropagation)
                        e.stopPropagation();
                    else
                        e.cancelBubble = true;
                }
                $('.common-nav-li').bind('click',function(e){
                    stopPropagation(e);
                });
                $(".common-nav-dd").on("click",function(e){

                    var _elem = $(this).find("span");
                    if(_elem.hasClass('common-nav-off')){
                        _elem.removeClass("common-nav-off");
                        _elem.addClass('common-nav-on');
                        $(this).find("ol").addClass("common-nav-this");
                    }else{
//                                if($(this).next().find('.common-nav-this').length) $(this).addClass('common-nav-this');
                        _elem.removeClass('common-nav-on');
                        _elem.addClass("common-nav-off");
                        $(this).find("ol").removeClass("common-nav-this");

                    }

                });
            }
        });
    };
    function loadPage(url) {
            var  res = basePath+url;
            $("#iframeContent").empty();

            $("#iframeContent").load(res);
        if(url == "sysuser/menu/Main"){
            $('.iframeContent').css({
                "padding":'0'
            });
        }else{
            $('.iframeContent').css({
                "padding":'10px'
            });
        }

    }
    function reLoadPage(url) {
        var  res = url;
        $("#iframeContent").empty();
        $("#iframeContent").load(res);
        if(url == "sysuser/menu/Main"){
            $('.iframeContent').css({
                "padding":'0'
            });
        }else{
            $('.iframeContent').css({
                "padding":'10px'
            });
        }
    }

    loadPage($.defult_url);

    var flg = true;
    $("#toggle").click(function(){
            $("#toggleDorw").show();
    });
    function stopPropagation(e) {
        if (e.stopPropagation)
            e.stopPropagation();
        else
            e.cancelBubble = true;
    }

    $(document).bind('click',function(){
        $('#toggleDorw').hide();
    });

    $('#userLogin').bind('click',function(e){
        stopPropagation(e);
    });


</script>